<template>
  <div>
    <van-nav-bar title="商城" left-arrow @click-left="onClickLeft" />
    <form action="get">
      <van-search
        :v-model="value"
        placeholder="搜索您想要的东东"
        show-action
        @search="onSearch"
        @cancel="onCancel"
        @focus="focus()"
      />
    </form>
    <van-swipe :autoplay="3000" indicator-color="white">
      <van-swipe-item>
        <img
          width="100%"
          height="150rem"
          src="https://img20.360buyimg.com/da/jfs/t1/41155/28/9264/127546/5d2c18ffE21055987/b26da712a3d151de.jpg"
        />
      </van-swipe-item>
      <van-swipe-item>
        <img
          width="100%"
          height="150rem"
          src="https://img13.360buyimg.com/da/jfs/t1/83278/14/4626/146462/5d2d3d4bEde78b159/cbedbc9f2ac99fcb.jpg"
        />
      </van-swipe-item>
      <van-swipe-item>
        <img
          width="100%"
          height="150ren"
          src="https://img12.360buyimg.com/da/jfs/t26836/359/320126857/373261/c5c1af4c/5b8e4b0dN0bfaf3b5.jpg"
        />
      </van-swipe-item>
      <van-swipe-item>
        <img
          width="100%"
          height="150rem"
          src="https://img14.360buyimg.com/da/jfs/t1/34701/20/12830/57575/5d0c9df6E331d70ee/cb6f9c630b1ce127.jpg"
        />
      </van-swipe-item>
    </van-swipe>
    <div id="jingdian">
      <p>经典专场</p>
      <img
        src="https://img14.360buyimg.com/da/jfs/t1/34701/20/12830/57575/5d0c9df6E331d70ee/cb6f9c630b1ce127.jpg"
      />
    </div>
    <van-row type="flex" justify="space-between">
      <van-col span="5" tag="div">全部</van-col>
      <van-col span="4" tag="div">名鞋</van-col>
      <van-col span="4">名表</van-col>
      <van-col span="4">饰品</van-col>
      <van-col span="4">名鞋</van-col>
    </van-row>
    <van-row>
      <van-card
        v-for="items in list"
        :price="items.goodsPrice"
        :desc="items.goodsDetail"
        :title="items.goodsName"
        :thumb="items.imageUrl"
        @click="tap(items.goodsId)"
      />
    </van-row>
  </div>
</template>
<script>
import axios from "axios";
export default {
  name: "cart",
  data() {
    return {
      value: "",
      cartlist: [],
      list: [],
    };
  },
  mounted() {
    axios({
      method: "get",
      url: "http://47.102.221.184:8083/secluxury/type/brandGoodsList"
    }).then(data => {
      // console.log(data.data);
      this.cartlist = data.data;
      this.cartlist.map(item => {
        //    console.log(item)
        // console.log(item.id)
        item.goodsList.map(items => {
          this.list.push(items);
        });
      });
    });
  },
  methods: {
    onClickLeft() {
      this.$router.push('/index')
    },
    onSearch() {},
    onCancel() {},
    tap(id) {
      console.log(id);
      this.$router.push("/details/" +id);
    },
    focus(){
      this.$router.push('/search')
    }
  }
};
</script>
<style scoped>
#jingdian {
  width: 80%;
  margin: 0 auto;
}
#jingdian img {
  width: 100%;
  height: 3rem;
}
</style>
